<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>List of Doctors</title>
    <style>
        /* CSS стили */
        table {
            width: 100%;
            border-collapse: collapse;
        }

        th, td {
            border: 1px solid #ddd;
            padding: 8px;
            text-align: left;
        }

        th {
            background-color: #f2f2f2;
        }

        tr:nth-child(even) {
            background-color: #f2f2f2;
        }

        .logout-button {
            margin-top: 20px;
        }
    </style>
</head>
<body>
    <h1>List of Doctors</h1>
    <table>
        <thead>
            <tr>
                <th>ID</th>
                <th>Last Name</th>
                <th>First Name</th>
                <th>Phone Number</th>
                <th>Email</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            {% for doctor in doctors %}
                <tr>
                    <td>{{ doctor.id }}</td>
                    <td>{{ doctor.last_name }}</td>
                    <td>{{ doctor.first_name }}</td>
                    <td>{{ doctor.phone_number }}</td>
                    <td>{{ doctor.email }}</td>
                    <td>
                        <button onclick="editDoctor({{ doctor.id }})">Edit</button>
                        <button onclick="deleteDoctor({{ doctor.id }})">Delete</button>
                    </td>
                </tr>
            {% endfor %}
        </tbody>
    </table>
    <button onclick="addDoctor()">Add Doctor</button>
    <button class="logout-button" onclick="logout()">Logout</button>

    <script>
        // Функция для отправки запроса на удаление врача
        async function deleteDoctor(doctorId) {
            const confirmDelete = confirm("Are you sure you want to delete this doctor?");
            if (confirmDelete) {
                try {
                    const response = await fetch(`/delete_doctor/${doctorId}`, { method: 'DELETE' });
                    const data = await response.json();
                    alert(data.message);
                    window.location.reload(); // Перезагрузка страницы после удаления врача
                } catch (error) {
                    console.error('Error:', error);
                    alert('An error occurred while deleting the doctor.');
                }
            }
        }

        // Функция для перехода на страницу добавления врача
        function addDoctor() {
            window.location.href = '/add_doctor';
        }

        // Функция для перехода на страницу редактирования врача
        function editDoctor(doctorId) {
            window.location.href = `/edit_doctor/${doctorId}`;
        }

        // Функция для отправки запроса на выход из системы
        async function logout() {
            try {
                const response = await fetch('/logout', { method: 'POST' });
                const data = await response.json();
                alert(data.message);
                window.location.href = '/doctors'; // Перенаправление на страницу входа после выхода
            } catch (error) {
                console.error('Error:', error);
                alert('An error occurred while logging out.');
            }
        }
    </script>
</body>
</html>
